<!DOCTYPE html>
<html>
	<head>
		<title>全选不选反选</title>
		<meta charset="utf-8">

	</head>
	<body>
		<input type="checkbox">1<br/>
		<input type="checkbox">2<br/>
		<input type="checkbox">3<br/>
		<input type="checkbox">4<br/>
		<input type="checkbox">5<br/>
		<input type="checkbox">6<br/>
		<input type="checkbox">7<br/>
		<input type="checkbox">8<br/>
		<input type="checkbox">9<br/>
		<input type="checkbox">10<br/>
		<input type="checkbox">11<br/>
		<input type="checkbox">12<br/>
		<input type="checkbox">13<br/>
		<input type="checkbox">14<br/>
		<input type="checkbox">15<br/>
		<button>全选</button>
		<button>不选</button>
		<button>反选</button>
		<button>第一次点选中，再点不选中</button>

		<script type="text/javascript">
			// 获取节点
			var inp = document.getElementsByTagName("input");
			// console.log(inp);
			var btn = document.getElementsByTagName("button");
			// console.log(btn);
			// 需求：点击全选按钮，所有复选框都选中
			btn[0].onclick = function(){
				// for(var i=0;i<inp.length;i++){
				// 	inp[i].checked = true;
				// }

				xuan(true);
				inp[14].style.display = "inline-block";
			}
			// 需求：点击不选按钮，所有复选框都不选中
			btn[1].onclick = function(){
				for(var i=0;i<inp.length;i++){
					inp[i].checked = false;
				}

				inp[14].style.display = "none";
			}

			// 需求：点击反选按钮，所有复选框原来选中的现在都不选中了，原来没选中的都要选中
			btn[2].onclick = function(){
				for(var i=0;i<inp.length;i++){
					if(inp[i].checked == true){
						inp[i].checked = false;
					}else{
						inp[i].checked = true;
					}
				}
			}

			// 需求：点击第一次点选中，再点不选中按钮，完成这个效果
			var num = 0;
			btn[3].onclick = function(){
				num++;
				if(num%2 == 1){
					for(var i=0;i<inp.length;i++){
						inp[i].checked = true;
					}
				}else{
					for(var i=0;i<inp.length;i++){
						inp[i].checked = false;
					}
				}
			}

			// 封装函数重复调用
			function xuan(a){
				for(var i=0;i<inp.length;i++){
					inp[i].checked = a;
				}
			}

		</script>

	</body>
</html>